<template>
	<div class="homeMore">
		 <div class="module-full-root" @click="exit">
		    <div class="module-full-content" @click="e=>e.stopPropagation()">
		      <div class="title">
				<div class="title">更多信息</div>
		        <div class="exitbtn" @click="exit">×</div>
		      </div>
		      <div class="content">
		        <div class="list">
		          <InfoList :data="data"></InfoList>
            <div class="block">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage4"
                :page-sizes="[30, 40, 50, 100]"
                :page-size="num"
                layout="total, sizes, prev, pager, next, jumper"
                :total='all'>
              </el-pagination>
            </div>
            </div>
		      </div>
		    </div>
		  </div>

	</div>
</template>
<script>
import ArgList from 'components/Home/ArgList'
import InfoList from './InfoList'
export default {
  name: 'homeMore',
  components: { ArgList,InfoList},
  props: ['exit','id'],
  data(){
    return{
      currentPage4: 1,
      data:[],
      all:0,
      pages:0,
      num:50
    }
  },
  mounted(){
    this.getMore(1,this.num)
  },
  methods:{
    handleSizeChange(val) {
      this.num = val
        this.handleCurrentChange(val)
    },
    handleCurrentChange(val) {
        this.getMore(val,this.num)
    },
    getMore:function(num,size){
        this.$http.post('/vrv-monitor-platform-web/module/queryMore',{
          id:850254265377918976,
          pageNum:num,
          pageSize:size
        }).then((res)=>{
          this.pages = res.data.pages // 页数
          this.all = res.data.total // 总数
          this.data= res.body.data
          this.data.forEach((value)=>{
            this.$set(value,'collectName', '加入收藏' )
          })
        })
      }
    },
}
</script>

<style lang="stylus" scoped>
.module-full-root
  position fixed
  top 0
  left 0
  right 0
  bottom 0
  z-index 100
  background-color rgba(0,0,0,.5)
  transition all .5s ease
  >.module-full-content
    transition all .5s ease

.module-full-content
  position absolute
  background white
  border-radius 0.4rem
  top 3.69rem
  left 7.12rem
  right 5.0rem
  height calc(100vh - 6rem)
  overflow hidden
  >.title
    height 3.8rem
    position relative
    border-bottom 1px solid #dcdcdc
    >.title
      font-size 1.25rem
      line-height @height
      text-align center
    >.exitbtn
      position absolute
      top 1rem
      right 1.2rem
      height 1.6rem
      width 1.6rem
      border-radius 3px
      border 1px solid #dcdcdc
      font-size 1.6rem
      color #a0a0a0
      line-height 1.6rem
      text-align center
      cursor pointer

.module-full-content>.content
  overflow auto
  height calc(100% - 3.8rem)
  >.chart
    height 22.75rem
    background #fcfcfc
    box-shadow 0 3px 5px rgba(0,0,0,.2)
    text-align center
    position relative
    >div
      position absolute
      left 2.88rem
      top 1.88rem
      font-size 0.88rem
    >img
      margin-top 1.88rem
      height 18.88rem
  >.list
    padding 1.88rem 1.25rem
    padding-top 1rem
    >.arg-list-root
      margin-bottom .5rem

.fulltrans-enter
.fulltrans-leave-active
  opacity 0
.block
  margin 1rem
  float right
</style>